<template>
	<view>
		<u-overlay :show="show" @click="close">
			<view class="u__overlay">
				<view class="workInfoViewoView">
					<view class="title1">提示</view>
					<view class="title2">分享作品需要实名认证。请授权微信获取手机号后再操作</view>
					<button class="weui_btn weui_btn_primary" open-type="getPhoneNumber" @getphonenumber="bindPhoneNumber">绑定微信手机号</button>
				</view>
			</view>
		</u-overlay>
	</view>
</template>

<script>
import { getPhoneNumber } from '@/utils/cloudFunction.js';
import { apiMixUrlApi } from '@/api/assemb.js';
export default {
	name: 'mobilePhone',
	data() {
		return {};
	},
	// 此处定义传入的数据
	props: {
		show: true
	},
	methods: {
		bindPhoneNumber(e) {
			uni.showLoading({
				title: '加载中...'
			});
			getPhoneNumber('getMobile', e.detail.cloudID).then(res => {
				this.sureBind(res.result);
			});
		},

		sureBind(phone) {
			let baseinfo = uni.getStorageSync('baseinfo');
			var self = this;
			var prams = {
				telephone: phone,
				type: 2
			};
			apiMixUrlApi(prams, 1005, 'UpdateUserInfo').then(json => {
				if (json.status == 0) {
					baseinfo.phone = json.telephone;
					uni.setStorage({
						key: 'baseinfo',
						data: baseinfo,
						success() {
							uni.hideLoading();
							self.$emit('onPhoneNumber');
							uni.showToast({
								title: '获取成功！',
								duration: 2000
							});
						}
					});
					console.log(uni.getStorageSync('baseinfo'));
				}
			});
		},

		close() {
			console.log('执行了');
			this.$emit('close');
		}
	}
};
</script>

<style lang="scss" scoped>
.u__overlay {
}
.workInfoViewoView {
	position: fixed;
	top: 40%;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	flex-direction: column;
	width: 80%;
	height: 180px;
	border-radius: 5px;
	background-color: white;
	align-items: center;
}
.title1 {
	margin-top: 15px;
	color: #333333;
	font-size: 16px;
}
.title2 {
	margin-top: 10px;
	color: #666666;
	font-size: 14px;
	width: 80%;
}
.weui_btn {
	margin-top: 20px;
	box-sizing: border-box;
	font-size: 14px;
	color: #666666;
	height: 35px;
	line-height: 35px;
	width: 120px;
}
.closeimage {
	position: fixed;
	top: 55%;
	left: 50%;
	transform: translate(-50%, -50%);
	background-color: white;
	border-radius: 15px;
	margin-top: 15px;
	width: 30px;
	height: 30px;
}
</style>
